{% extends 'AdminBundle::layout.html.twig' %}


    {% block title %}{% if type == 1 %}发布公告通知{% else %}发布培训通知{% endif %}{% endblock %}

    {% block css %}
        <link type="text/css" rel="stylesheet" href="{{ asset('assets/css/bootstrap-datetimepicker.min.css') }}">
    <style>
        .upload-finish{
            float: left;
        }
        .display{
            width: 100%;
        }
        .pop-add-slide{
            height: 205px;
        }
        .mes-select{
            width: 100%;
        }
        .pop-add-top .mes-form{
            margin-top: 5px;
            margin-left: 10px;
            margin-right: 10px;
        }
        .pop-add-top .mes-input{
            margin-left: 10px;
            margin-right: 10px;
        }
        .mes-query-btn{
            clear:both;
            display: block;
            margin: auto;
            float:initial;
            cursor:pointer;
        }
        .collect-mes-box{
            width: inherit;
        }

    </style>
    {% endblock %}


    {% block top %}
        {#{{ dump() }}#}
        {{ parent() }}
    {% endblock %}



    {% block left_body_top %}
        {{ parent() }}
    {% endblock %}

    {% block left_body %}
        {{ parent() }}
    {% endblock %}

    {% block right_body %}

    <div class="page-header">
        <div class="page-right-top">
            <div class="right-top">
                <span class="right-title">消息通知</span>
            </div>
            <div class="top-nav">{% if type == 1 %}公告列表{% elseif type == 2 %}培训通知{% endif %}</div>
            <span class="r-arrow top-r-arrow"></span>
            <div class="top-nav top-nav-active">{% if type == 1 %}发布公告{% elseif type == 2 %}发布培训{% endif %}</div>
        </div>
        <div class="main-content">
            <div class="mes-content">

                <div class="main-mes-content">
                    <form id="comMesBtn">
                        <div class="com-list">

                            {% if type == 1 %}

                            <div class="com-list-box" style="width: 720px;">
                                <div class="com-left fl">公告标题</div>
                                <input type="text" name="title" class="notice-title is-change pop-com-input" maxlength="20" placeholder="请输入公告标题">
                                <span class="pop-com-num">20</span>
                            </div>

                            <div class="com-list-box">
                                <div class="com-left fl">公告内容</div>
                                <textarea name="outline" class="is-change pop-com-textarea" placeholder="请输入公告内容" cols="30" rows="8"></textarea>
                            </div>

                            {% elseif type == 2 %}

                                <div class="com-list-box" style="width: 725px;">
                                    <div class="com-left fl">培训标题</div>
                                    <input type="text" name="title" class="training-title is-change pop-com-input" maxlength="20" placeholder="请输入培训标题">
                                    <span class="pop-com-num">20</span>
                                </div>

                                <div class="com-list-box">
                                    <div class="com-left fl">标题关键字</div>
                                    <input type="text" name="title" class="training-keyword is-change pop-com-input" maxlength="20" placeholder="请输入标题关键字">
                                </div>

                                <div class="com-list-box display">
                                    <div class="com-list-box fl">
                                        <div class="com-left fl">培训开始日期</div>
                                        <div class="mes-input fl mes-date" style="width: 217px;margin-right: 0;">
                                            <span class="date-icon"></span>
                                            <div class="form-group">
                                                <div class="right col-xs-6 text-left">
                                                    <div class="input-group">
                                                        <input type="text" style="width: 185px;" class="form-control form_datetime" id="addtime" name="addtime" placeholder="开始时间">
                                                        <span class="input-group-addon" id="basic-addon"><span class="glyphicon glyphicon-time" aria-hidden="true"></span></span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>


                                    <div class="com-list-box fl">
                                        <div class="com-left fl">培训结束日期</div>
                                        <div class="mes-input fl mes-date" style="width: 217px;margin-right: 0;">
                                            <span class="date-icon"></span>
                                            <div class="form-group">
                                                <div class="right col-xs-6 text-left">
                                                    <div class="input-group">
                                                        <input type="text" style="width: 185px;" class="form-control form_datetime" id="addtimeEnd" name="addtimeEnd" placeholder="结束时间">
                                                        <span class="input-group-addon" id="basic-addon"><span class="glyphicon glyphicon-time" aria-hidden="true"></span></span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>



                                    <div class="clearfix"></div>
                                </div>

                                <div class="com-list-box display">

                                    <div class="com-list-box fl">
                                        <div class="com-left fl" style="width: 66px;">培训机构</div>
                                        <input type="text" class="tarin-input training-agency" placeholder="请输入培训机构">
                                    </div>


                                    <div class="com-list-box fl">
                                        <div class="com-left fl">机构关键词</div>
                                        <input type="text" class="tarin-input training-agency-keyword" placeholder="请输入机构关键词">
                                    </div>



                                    <div class="clearfix"></div>
                                </div>

                                <div class="com-list-box display">

                                    <div class="com-list-box fl">
                                        <div class="com-left fl" style="width: 66px;">培训师</div>
                                        <input type="text" class="tarin-input trainer" placeholder="请输入培训师姓名">
                                    </div>

                                    <div class="com-list-box fl">
                                        <div class="com-left fl" style="width: 66px;">参与人员</div>
                                        <input type="text" class="tarin-input participant" placeholder="请输入培训参与人员">
                                    </div>

                                    <div class="clearfix"></div>
                                </div>


                                <div class="com-list-box">
                                    <div class="com-left fl">培训内容</div>
                                    <textarea name="outline" class="is-change pop-com-textarea training-content" placeholder="请输入培训内容" cols="30" rows="8"></textarea>
                                </div>

                            {% endif %}

                            <div class="display">
                                <div class="com-list-box fl">
                                    <div class="com-left fl">附件</div>
                                    <label class="upload-btn fl" for="upload_file" style="margin: 0;">点击上传</label>

                                    <div class="upload-finish">
                                        {#{% if data.data.id > 0 %}#}
                                            {#<div class="g-left-list" style="margin: 26px 10px 0;">#}
                                                {#<div style="width: 100%;" class="a-line">#}
                                                    {#<span class="p-name">{{ data.data.attachment.origin_name }}</span>#}
                                                {#</div><span class="reset-icon g-left-icon">#}
                                    {#</span>#}
                                            {#</div>#}
                                        {#{% endif %}#}
                                    </div>


                                    <input type="file" id="upload_file">
                                    <div class="clearfix"></div>
                                </div>
                                <div class="clearfix"></div>
                            </div>

                            <div class="display">
                                <div class="com-list-box fl">
                                    <div class="com-left fl" style="margin-top: 12px;">发送给</div>
                                    <div id="collect-mes" class="collect-mes-box">
                                        <div class="collect-mes"></div>
                                        <span class="send-out fl" style="margin: 16px 0 0 10px;"></span>

                                        <div class="clearfix"></div>
                                    </div>

                                    <div class="clearfix"></div>
                                </div>
                                <div class="clearfix"></div>
                            </div>

                            <div class="clearfix"></div>
                            <div class="add-mem-box" style="margin-top: 40px;">
                                <div class="com-left fl"></div>
                                <div class="acc-opera-btn fl mem-btn p-first-btn">发布</div>
                                <div class="acc-opera-btn fl mem-cancel">取消</div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="pop-status opacity"></div>

    <!--接收公告人员-->
    <div class="pop-first pop-receive-member" style="display: none;">
        <div class="pop-title">选择接收培训通知人员
            <span class="close close-icon"></span>
        </div>
        <div style="padding: 20px;">
            <div class="pop-add-fl fl">

            </div>
            <div class="pop-add-fr">
                <form id="userListForm">
                    <div class="pop-add-top">
                        {#<div class="screen-term">#}
                            {#<select class="screen-de" name="" id="">#}
                                {#<option value="">筛选条件</option>#}
                                {#<option value="企业类别">企业类别</option>#}
                                {#<option value="企业载体">企业载体</option>#}
                                {#<option value="条件四">状态</option>#}
                                {#<option value=""></option>#}
                            {#</select>#}
                        {#</div>#}

                        <div class="mes-input fl" style="width: 138px;">
                            <input type="text" class="keyword-input" style="width: 120px;" name="user_name" placeholder="请输入联络人姓名">
                        </div>

                        <div class="mes-input fr" style="width: 138px;">
                            <input type="text" class="keyword-input" style="width: 120px;" name="company_name" placeholder="请输入企业名称">
                        </div>

                        <div class="fl mes-form" style="width: 138px;">
                            <select name="company_category_id" class="mes-select fl">
                                <option value="">请选择企业类别</option>
                                {% for item in data.category %}
                                <option value="{{ item.id }}">{{ item.company_category_name }}</option>
                                {% endfor %}
                            </select>
                        </div>


                        <div class="fr mes-form" style="width: 138px">
                            <select name="company_attribute_id" class="mes-select fl">
                                <option value="">请选择企业属性</option>
                                {% for item in data.attribute %}
                                    <option value="{{ item.id }}">{{ item.company_attribute_name }}</option>
                                {% endfor %}
                            </select>
                        </div>

                        <div class="fl mes-form" style="width: 138px;margin-bottom:8px">
                            <select name="user_admin_id" class="mes-select fl">
                                <option value="">请选择科技载体</option>
                                {% for item in data.teac_admin %}
                                    <option value="{{ item.id }}">{{ item.nickname }}</option>
                                {% endfor %}
                            </select>
                        </div>


                        <div class="fr mes-form" style="width: 138px;margin-bottom:8px">
                            <select name="is_tech_user" class="mes-select fl">
                                <option value="">联络人身份属性</option>
                                <option value="1">科技联络人</option>
                                <option value="2">其他联络人</option>
                            </select>
                        </div>

                        <div class="mes-query-btn">查询</div>
                    </div>

                </form>

                <div class="pop-add-slide">
                    <div class="choose-top">
                        <input type="checkbox" id="allcbox" class="fl">
                        <span class="choose-all">全选</span>
                    </div>

                    {#添加人员列表#}




                </div>
            </div>

            <button class="pop-g-btn">确定</button>

            <div class="clearfix"></div>
        </div>
    </div>


    {% endblock %}


{% block box %}
{% endblock %}


{% block javascript %}
    <script src="{{ asset('assets/js/bootstrap-datetimepicker.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('assets/js/bootstrap-datetimepicker.zh-CN.js') }}" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {

        //  高度

        // $('.mes-content').height($('.main-content').height());

        SidebarHighlighting('2');
        {% if type == 1 %}
        SonSidebar('2', '1');
        {% elseif type == 2 %}
        SonSidebar('2', '2');
        {% endif %}

        var attachment_id = '';

        // 日历
        $('.form_datetime').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            language:  'zh-CN',
            format: 'yyyy-mm-dd',
            todayBtn:  1,
            autoclose: 1
        });

        // 监听input值的变化
        $('.is-change').keyup(function() {
            var this_val_len = $(this).val().length;

            $(this).next('.pop-com-num').text(20 - this_val_len);
        });

        $('.send-out').on('click', function() {
            ComMesOpen();

            // 获取列表数据
            var html = $('.collect-mes').html();

            $('.pop-add-fl').empty().html(html);
        });

        //点击取消
        $('.mem-cancel, .close-icon').on('click', function() {
            ComMesClose();
        });

        // 取消 发布
        $(".mem-cancel").click(function(){
            {% if type == 1 %}

            var reload_url = "{{ path('article_notice_list') }}";
            {% elseif type == 2 %}

            var reload_url = "{{ path('article_training_list') }}";

            {% endif %}

            location.href=reload_url;
        })

        var $subBox = $("input[name='sid[]']");

        //点击全选
        $("#allcbox").click(function() {
            $("input[name='sid[]']").prop("checked",this.checked);

            $('.pop-add-fl').empty();
            $("input[name='sid[]']").each(function() {
                var $this = $(this);
                if ($this.is(':checked')) {

                    getListData($this);
                }
            })
        });

        // 点击checkbox框
        $("body").on("click","input[name='sid[]']",function(){
            $("#allcbox").prop("checked",$subBox.length == $("input[name='sid[]']:checked").length ? true : false);

            var box_id = $(this).data('m');

            if ($(this).is(':checked')) {

                getListData($(this));

            } else {
                $('.g-left-list').each(function() {
                    var $this = $(this);

                    if ($this.data('id') == box_id) {
                        $this.remove();
                    }
                })
            }
        });

        // 点击左上角叉号
        $('body').on('click', '.g-left-icon', function() {
            var $this = $(this);

            var list_id = $this.parent('.g-left-list').data('id');

            $this.parent('.g-left-list').remove();

            $subBox.each(function() {
                var $this = $(this);
                if (list_id == $this.data('m')) {
                    $this.prop("checked", false);
                }
            });

            $("#allcbox").prop("checked",$subBox.length == $("input[name='sid[]']:checked").length ? true : false);
        });

        //  点击确定
        $('.pop-g-btn').on('click', function() {

            $('.collect-mes').empty();

            ComMesClose();

            var html = $('.pop-add-fl').html();

            $('.collect-mes').prepend(html);


        });


        // ajax 上传附件
        function uploadFile() {
            var _file = this;
            var data = new FormData();
            data.append('attachment', _file.files[0]);

            URL_fileShareUpload = "{{ path('api_public_upload_attachment') }}";
            $.ajax({
                url:URL_fileShareUpload,
                type: 'POST',
                dataType: 'json',
                processData: false,
                contentType: false,
                data: data,
                success: function (data) {
                    if(data.errorCode == 0){

                        $('.upload-finish').html('');
                        attachment_id = data.data.attachment_id;
                        popStatus(1, '上传成功', 1,'', true);

                        var html = '<div class="g-left-list" style="margin: 1px 10px">' +
                            '<div style="width: 100%;" class="a-line">' +
                            '<span class="p-name">'+ data.data.name +'</span> ' +
                            '<span class="p-phone"></span>' +
                            '</div><span class="reset-icon g-left-icon">' +
                            '</span>' +
                            '</div>';

                        $('.upload-finish').html(html);
                    } else {
                        alert(data.message);
                        return false;
                    }
                }
            });
        }
        $("#upload_file").on("change", uploadFile);

        // 删除上传的附件
        $("body").on("click",".reset-icon.g-left-icon",function(){

            $(this).parent('.g-left-list').remove();
            attachment_id = "";

        })

        // 删除选中的人员
        $("body").on("click",".reset-user-list",function(){

            // 修改右侧列表的选中状态
            var re_id = $(this).parent('.g-left-list').data("id");

            $(".g-choose-list").each(function(){
                var right_this = $(this);
                var right_id = right_this.data("id");
                if(right_id == re_id){
                    right_this.find("input[name='sid[]']").prop("checked",false);
                }
            })
        })


        // 发短信提醒
        function phoneSalt(user_ids){
            $.post("{{ path('api_public_notice_phone_message') }}",{user_ids:user_ids},function(data){
                console.log(data);

            })
        }

        // 发邮件提醒
        function emailSend(user_ids){
            $.post("{{ path('api_public_notice_mail') }}",{user_ids:user_ids},function(data){
                console.log(data);
            })
        }




        // 当前时间
        var curr_date = "{{ curr_date|default('') }}";

        // 点击发布
        $('.p-first-btn').on('click', function() {


            var is_arr = [];
            // 接收人员数据
            $('.collect-mes .g-left-list').each(function() {

                var $this = $(this);
                var p_id = $this.data('id');
                is_arr.push(p_id);
            });

            {% if type == 1 %}
                var title = $('.pop-com-input').val();

                var content = $('.is-change.pop-com-textarea').val();

                if(title == ""){
                    popStatus(2,"请输入标题",1,'',true);
                    return false;
                }

                if(content == ""){
                    popStatus(2,"请输入内容",1,'',true);
                    return false;
                }
                var is_training = 0;

            {% elseif type == 2 %}
                var title = $(".training-title").val();
                var content = $(".training-content").val();
                var training_title_keyword = $(".training-keyword").val();
                var training_start_at = $("#addtime").val();
                var training_end_at = $("#addtimeEnd").val();
                var training_agency = $(".training-agency").val();
                var training_agency_keyword = $(".training-agency-keyword").val();
                var trainer = $(".trainer").val();
                var participant = $(".participant").val();
                var is_training = 1;

                if(title == ""){
                    popStatus(2,"请输入标题",1,'',true);
                    return false;
                }


                if(training_title_keyword == ""){
                    popStatus(2,"请输入标题关键字",1,'',true);
                    return false;
                }

                if(training_start_at == ""){
                    popStatus(2,"请选择培训开始时间",1,'',true);
                    return false;
                }

                if(training_end_at == ""){
                    popStatus(2,"请选择培训结束时间",1,'',true);
                    return false;
                }

                // 发布时间判断
                if(training_end_at < training_start_at ){

                    popStatus(2,"培训开始时间不能大于培训结束时间",1,'',true);
                    return false;
                }

                if(training_end_at < curr_date ){
                    popStatus(2,"选择今日以及未来的日期和时间",1,'',true);
                    return false;
                }


                if(training_agency == ""){
                    popStatus(2,"请输入培训机构",1,'',true);
                    return false;
                }

                if(training_agency_keyword == ""){
                    popStatus(2,"请输入培训机构关键字",1,'',true);
                    return false;
                }
                if(trainer == ""){
                    popStatus(2,"请输入培训师",1,'',true);
                    return false;
                }
                if(participant == ""){
                    popStatus(2,"请输入参与人员",1,'',true);
                    return false;
                }

                if(content == ""){
                    popStatus(2,"请输入内容",1,'',true);
                    return false;
                }

            {% endif %}

            if(attachment_id == ""){
                popStatus(2,"请先上传附件",1,'',true);
                return false;
            }

            if(is_arr.length == 0){
                // 全部人员
                is_arr = all_users_id
//                popStatus(2,"请选择接收人员",1,'',true);
//                return false;
            }


            var user_ids = JSON.stringify(is_arr);


            var prame = {"is_training":is_training,"title":title,"content":content,"attachment_id":attachment_id,"user_ids":user_ids};

            {% if type == 2 %}
                prame.training_title_keyword = training_title_keyword;
                prame.training_start_at = training_start_at;
                prame.training_end_at = training_end_at;
                prame.training_agency = training_agency;
                prame.training_agency_keyword = training_agency_keyword;
                prame.trainer = trainer;
                prame.participant = participant;
            {% endif %}


            $.post("{{ path('api_admin_article_notice_release') }}",prame,function(data){
                console.log(data);
                if(data.errorCode == 0){

                    //发短信提醒
                    console.log(prame.user_ids);
                    

                    phoneSalt(prame.user_ids);

                    emailSend(prame.user_ids);
                    {% if type == 1 %}
                        popStatus(1,"发布成功",1,"{{ path('article_notice_list') }}",true);
                    {% elseif type == 2 %}

                        popStatus(1,"发布成功",1,"{{ path('article_training_list') }}",true);
                    {% endif %}
                } else {
                    popStatus(2,data.message,1,'',true);
                }

            })

        });




        //  向弹窗左侧追加数据
        function getListData(isAajax) {
            var is_num = isAajax.data('m');
            var is_name = isAajax.data('n');
            var is_phone = isAajax.data('p');

            var html = '<div class="g-left-list" data-id="'+ is_num +'">\
                            <div style="width: 100%;" class="a-line">\
                                <span class="p-name">'+ is_name +'</span>\
                                <span class="p-phone">'+ is_phone +'</span>\
                            </div>\
                            <span class="reset-icon g-left-icon reset-user-list"></span>\
                        </div>';

            $('.pop-add-fl').prepend(html);
        }

        // 弹框显示函数
        function ComMesClose() {
            $('.pop-status').hide();
            $('.pop-first').hide();
        }

        function ComMesOpen() {
            $('.pop-status').show();
            $('.pop-first').show();
        }


        // 获取消息接收人员列表
        var all_users_id = [];
        function getMemberList(prame){
            $(".pop-add-slide").empty();
            console.log(prame);

            if(prame != undefined){
                prame_date = prame;
            } else {
                prame_date = {};
            }
            $.getJSON("{{ path('api_admin_get_user_list') }}",prame_date,function(data){

                console.log(data);
                var  item = data.data;
                for(var i in item){
                    all_users_id.push(item[i].id);

                    var html = '';
                    html += '<div class="g-choose-list" data-id="'+ item[i].id +'">';
                    html += '<input name="sid[]" autocomplete="off" type="checkbox" class="fl" data-m="'+ item[i].id +'" data-n="'+ item[i].name +'" data-p="'+ item[i].phone +'">';
                    html += '<div class="g-message">';
                    html += '<span class="g-name">'+ item[i].name +'</span>';
                    html += '<span class="g-name">'+ item[i].phone +'</span>';
                    html += '<span class="g-name">'+ item[i].company_full_name +'</span>';
                    html += '</div>';
                    html += '</div>';

                    $(".pop-add-slide").append(html);
                }

                //选中已选择人员
                judgeSelected();

            })


        }
        getMemberList();


        // 人员查询
        $(".mes-query-btn").click(function(){
            var prame = $("#userListForm").serializeObject();
            getMemberList(prame);

        })

        function judgeSelected(){
            // 判断该人员是否被选择
            $(".g-choose-list").each(function(){
                var search_list = $(this);
                var search_id = search_list.data("id");

                $(".g-left-list").each(function(){
                    var g_this = $(this);
                    var g_id = g_this.data("id");
                    if(g_id == search_id){
                        search_list.find("input[name='sid[]']").prop("checked",true);
                    }

                })


            })

        }





    })
</script>
{% endblock %}